<script src="login.service.ts"></script>
<ion-header>
  <ion-navbar>
    <!--<ion-icon ios="ios-paper-plane" md="md-paper-plane" (click)="publish()"></ion-icon>-->
  </ion-navbar>
</ion-header>

<ion-content>
  <div class="register-form">
    <form>
      <ion-list>
        <ion-item>
          <ion-icon ios="ios-phone-portrait" md="md-phone-portrait"></ion-icon>
          <input [(ngModel)]="registerData.cellphone" name="cellphone" type="number" placeholder="请输入手机号"/>
          <ion-icon class="clear" margin-right [hidden]="!registerData.cellphone"
                    (click)="registerData.cellphone = null" ios="ios-close-circle" md="md-close-circle"></ion-icon>
        </ion-item>
        <ion-item>
          <ion-icon ios="ios-card" md="md-card"></ion-icon>
          <input class="verification-input" [(ngModel)]="registerData.verificationCode" name="verificationCode"
                 type="number" placeholder="请输入验证码"/>
          <ion-icon class="clear" style="margin-right: 5px" [hidden]="!registerData.verificationCode"
                    ios="ios-close-circle" md="md-close-circle"
                    (click)="registerData.verificationCode = null"></ion-icon>
          <span (click)="sendVerificationCode(registerData.cellphone)"
                [ngClass]="{'send-verification-code':true,'disabled-verification-message': smsDisable}"
                margin-right float-end>{{registerData.sendVerificationCodeMessage}}</span>
        </ion-item>
        <!--<div class="form-item">-->
          <!--<ion-icon ios="ios-call" md="md-call"></ion-icon>-->
          <!--<input autofocus style="border: none" placeholder="验证码" [(ngModel)]="registerData.verificationCode"-->
                 <!--name="verificationCode"-->
                 <!--spellcheck="false"/>-->
        <!--</div>-->
        <ion-item>
          <ion-icon style="color:#488aff" ios="ios-phone-portrait" md="md-phone-portrait"></ion-icon>
          <input type="password" name="cellphone" placeholder="请输入密码" [(ngModel)]="registerData.password">
          <ion-icon [hidden]="!registerData.password" class="clear" ios="ios-close-circle" md="md-close-circle"
                    (click)="registerData.password = null"></ion-icon>
        </ion-item>
        <!--<div class="form-item">-->
          <!--<ion-icon ios="ios-call" md="md-call"></ion-icon>-->
          <!--<input autofocus style="border: none" placeholder="密码" [(ngModel)]="registerData.password" name="password"-->
                 <!--spellcheck="false"/>-->
        <!--</div>-->
        <ion-item>
          <ion-icon style="color:#488aff" ios="ios-phone-portrait" md="md-phone-portrait"></ion-icon>
          <input name="cellphone" placeholder="请输邀请码" [(ngModel)]="registerData.invitationCode">
          <ion-icon [hidden]="!registerData.invitationCode" class="clear" ios="ios-close-circle" md="md-close-circle"
                    (click)="registerData.invitationCode = null"></ion-icon>
        </ion-item>
        <!--<div class="form-item">-->
          <!--<ion-icon ios="ios-call" md="md-call"></ion-icon>-->
          <!--<input autofocus style="border: none" placeholder="邀请码" [(ngModel)]="registerData.invitationCode"-->
                 <!--name="invitationCode"-->
                 <!--spellcheck="false"/>-->
        <!--</div>-->
      </ion-list>
      <ion-row responsive-sm>
        <button margin [disabled]="!registerBtnEnable()" ion-button (click)="registerClick()" block>注册</button>
      </ion-row>
      <ion-row responsive-sm text-center>
        <ion-col (click)="toLogin()">
          已有账号登录
        </ion-col>
      </ion-row>
    </form>
  </div>
</ion-content>
